{% extends 'base.html' %}

{% block content %}
  
<div class="right">
  <div class="top">
      <div class="tool">
          <div class="class-info">
            <!-- action提交的路径不能写死，写成 {% url 'grade_list' %}  grade_list是定义url时的name值-->
              <form method="get" action="{% url 'grade_list' %}">
                  <span>班级名称:</span>
                  <input type="text" name="search" placeholder="搜索班级名称..." value="">
                  <input type="submit" value="搜索">
                  <a href="{% url 'grade_create' %}">
                      <button type="button" class="add">新增</button>
                  </a>
              </form>
          </div>
      </div>
  </div>
  <div class="bottom">
  <table>
      <thead>
          <tr>
              <th>班级名称</th>
              <th>班级编号</th>
              <th>操作</th>
          </tr>
      </thead>
      <tbody>
        {% for grade in grades %}
          <tr>
              <td>{{grade.grade_name}}</td>
              <td>{{grade.grade_number}}</td>
              <td>
                  <a href="{% url 'grade_update' grade.pk %}">
                      <button class="add">编辑</button>
                  </a>
                  <a href="{% url 'grade_delete' grade.pk %}">
                      <button class="del">删除</button>
                  </a>
              </td>
          </tr>
        {% endfor %}
          
      </tbody>
  </table>

  <!-- 分页导航 -->
  <div class="pagination">
      <span class="step-links">
          <span class="step-links">
            {% if page_obj.has_previous %}
                <a href="?page=1">&laquo; 首页</a>
                <a href="?page={{ page_obj.previous_page_number }}">上一页</a>
            {% endif %}

            <span class="current">
                 {{ page_obj.number }} / {{ page_obj.paginator.num_pages }}
            </span>

            {% if page_obj.has_next %}
                <a href="?page={{ page_obj.next_page_number }}">下一页</a>
                <a href="?page={{ page_obj.paginator.num_pages }}">尾页 &raquo;</a>
            {% endif %}
            
        </span>
        
        <div>
            当前页码 {{ page_obj.number }}
            总页数 {{ page_obj.paginator.num_pages }}
        </div>

      </span>
  </div>
  </div>

</div>

</div>

{% endblock %}
